@import './public.scss';

.wrapper {
  width: 1100px;
  margin: 0 auto;
}

body,
html {
  height: 100%;
}

body {
  overflow-x: hidden;
  background-color: #f8f8f8;
}

// 头部
.header {
  width: 100%;
  background-color: #fff;

  .wrapper {
    min-height: 110px;
    display: flex;
    align-items: center;
    justify-content: space-between;

    .header_left {
      a {
        display: block;
        width: 330px;
        height: 65px;

        background-image: url(http://kaola-haitao.oss.kaolacdn.com/f69c45fd-8d91-4e18-8e3f-a546be302a12.png);
        background-size: auto 65px;
        background-repeat: no-repeat;
      }
    }

    .header_right {
      a {
        display: block;
        width: 504px;
        height: 100px;
        background-image: url(https://kaola-haitao.oss.kaolacdn.com/30bee055-69af-4f3a-a232-5f330cbc98c1_1008_200.png);
        background-size: 504px 100px;
      }
    }
  }

}

// body
.content {
  // min-height: calc(100% - 266px);

  .wrapper {
    display: flex;
    min-height: 600px;
    align-items: center;

    .content_left {
      margin-right: 200px;

      a {
        display: block;
        width: 400px;
        height: 203px;
        background-image: url(https://kaola-haitao.oss.kaolacdn.com/e2722b45-286b-45e9-a8e2-4558f4f1bee6.png);
        background-repeat: no-repeat;
      }
    }

    .content_right {
      width: 350px;
      height: 260px;
      background-color: #fff;

      .top {
        height: 64px;
        text-align: center;
        border-bottom: 2px solid #f8f8f8;
        line-height: 64px;
      }

      .center {
        // margin-bottom: 10px;
        margin-top: 10px;

        .center_top {
          width: 100%;
          padding-left: 35px;

          .input_top {
            width: 270px;
            height: 36px;
            line-height: 36px;
            line-height: 36px;
            border: 1px solid #d5d5d5;
            border-radius: 18px;
            padding-left: 5px;

            .icon-wode {
              font-size: 16px;
              vertical-align: middle;
            }

            input {
              display: inline-block;
              width: 220px;
              height: 16px;
              vertical-align: middle;
            }
          }

          .error {
            width: 270px;
            height: 32px;
            line-height: 32px;
            margin-left: 8px;

          }
        }

        .center_bottom {
          @extend .center_top;

          .input_bottom {
            width: 270px;
            height: 36px;
            line-height: 36px;
            line-height: 36px;
            border: 1px solid #d5d5d5;
            border-radius: 18px;
            padding-left: 5px;

            .icon-eyeoclose {
              font-size: 16px;
              vertical-align: middle;
            }
          }

          .error1 {
            width: 270px;
            height: 32px;
            line-height: 32px;
            margin-left: 8px;

          }

        }
      }

      .bottom {
        padding-left: 35px;

        .register {
          width: 270px;
          height: 36px;
          line-height: 36px;
          border: 1px solid #d5d5d5;
          border-radius: 18px;
          padding-left: 5px;
          background-color: red;
          color: #fff;
          text-align: center;
          cursor: pointer;

        }

      }

    }



  }

}


// 底部2
.footerTwo {
  width: 100%;
  background: #fff;
}